<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="css/base.css" />
    <link rel="stylesheet" href="css/public.css" />
    <link rel="stylesheet" href="css/style.css" />
  </head>
  <body>
    <div class="header">
      <div class="content flex">
        <div class="logo"><img src="images/newLogo.png" alt="" /></div>
        <div class="menu">
          <div class="menu_up"><img src="images/menu.png" alt="" /></div>
          <div class="menu_down none">
            <div class="down_head flex">
              <img src="images/newLogo.png" alt="" />
              <img src="images/close_b.png" ∏ class="closeMenu" alt="" />
            </div>
            <div class="topSearch">
              <input type="text" class="searchInput" placeholder="请输入关键" />
              <img src="images/search-b.png" alt="" />
            </div>
            <ul>
              <li><a href="">新闻中心</a></li>
              <li><a href="">培训课程</a></li>
              <li><a href="">特色项目</a></li>
              <li><a href="">师资列表</a></li>
              <li><a href="">关于我们</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <div class="Filebox m-top">
      <div class="title">
        <div class="name">
          学习进度
        </div>
      </div>
      <div class="LearningProcess">
        <div class="title">发大师级分布式咖啡机不舒服吧课程</div>
        <div class="center">
          <section class="timeline" style="">
            <div class="timeline-block timeline_Finish">
              <div class="ctimeline-img cd-picture"></div>
              <span class="item dot-top"></span>
              <div class="r-info">
                <div>
                  <text class="Headlines">准备阶段</text>
                </div>
                <div class="msgBox">
                  <div class="name">报名时间</div>
                  <div class="time">
                    <ul>
                      <li>
                        <ul>
                          <li>报名时间:</li>
                          <li>2020年5月11日</li>
                          <li><img src="images/yes.png" alt="" /></li>
                        </ul>
                        <ul>
                          <li>审核通过:</li>
                          <li>2020年5月11日</li>
                          <li><img src="images/yes.png" alt="" /></li>
                        </ul>
                        <ul>
                          <li>开课时间:</li>
                          <li>2020年5月11日</li>
                          <li><img src="images/yes.png" alt="" /></li>
                        </ul>
                      </li>
                    </ul>
                  </div>
                  <!-- <span class="cd-date">2017-12-16 08:08:08</span> -->
                </div>
              </div>
            </div>
            <div class="timeline-block">
              <div class="ctimeline-img cd-picture"></div>
              <span class="item dot-top"></span>
              <div class="r-info">
                <div>
                  <text class="Headlines">在线学习</text>
                </div>
                <div class="msgBox">
                  <div class="name">视频学习</div>
                  <div class="VideoLearn">
                    <ul>
                      <li>
                        <ul>
                          <li>学习时间：</li>
                          <li>2020年3月15日-2020年4月18日</li>
                        </ul>
                        <ul>
                          <li>学习进度：</li>
                          <li>100/300 分钟</li>
                        </ul>
                      </li>
                    </ul>
                  </div>
                  <div class="Bar">
                    <div style="width: 50%;">
                      <span>50%</span>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="timeline-block">
              <div class="ctimeline-img cd-picture"></div>
              <span class="item dot-top"></span>
              <div class="r-info">
                <div class="msgBox">
                  <div class="name">网络考试</div>
                  <div class="VideoLearn">
                    <ul>
                      <li>
                        <ul>
                          <li>考试时间</li>
                          <li>2020年3月15日-2020年4月18日</li>
                        </ul>
                      </li>
                      <li class="wlbtnbox">
                        <span class="wlbtn info">尚未开始</span>
                        <a href="" class="wlbtn primary">已开始</a>
                        <span class="wlbtn warning">等待批改</span>
                        <span class="wlbtn success">合格（65分）</span>
                        <span class="wlbtn danger">不合格（45分），可补考</span>
                        <span class="wlbtn danger">不合格（45分）</span>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
            <div class="timeline-block">
              <div class="ctimeline-img cd-picture"></div>
              <span class="item dot-top"></span>
              <div class="r-info">
                <div class="msgBox">
                  <div class="name">学习结束</div>
                  <div class="VideoLearn">
                    <ul>
                      <li class="wlbtnbox">
                        <span class="wlbtn success">合格（65分）</span>
                        <span class="wlbtn danger">不合格（45分），可补考</span>
                        <span class="wlbtn danger">不合格（45分）</span>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
            <div class="timeline-block">
              <div class="ctimeline-img cd-picture"></div>
              <span class="item dot-top"></span>
              <div class="r-info">
                <div>
                  <text class="Headlines">面授学习</text>
                </div>
                <div class="msgBox">
                  <div class="name">面授学习</div>
                  <div class="VideoLearn">
                    <ul>
                      <li>
                        <ul>
                          <li>学习时间</li>
                          <li>2020年3月15日-2020年4月18日</li>
                        </ul>
                      </li>
                      <li class="wlbtnbox">
                        <a href="" class="wlbtn look">查看详情</a>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
            <div class="timeline-block">
              <div class="ctimeline-img cd-picture"></div>
              <span class="item dot-top"></span>
              <div class="r-info">
                <div class="msgBox">
                  <div class="name">作业</div>
                  <div class="VideoLearn">
                    <ul>
                      <li>
                        <ul>
                          <li>提交时间：</li>
                          <li>2020年3月15日-2020年4月18日</li>
                        </ul>
                      </li>
                      <li class="wlbtnbox">
                        <span class="wlbtn info">尚未开始</span>
                        <a href="" class="wlbtn primary">已开始</a>
                        <span class="wlbtn success">合格（65分）</span>
                        <span class="wlbtn danger">不合格（45分）</span>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
            <div class="timeline-block">
              <div class="ctimeline-img cd-picture"></div>
              <span class="item dot-top"></span>
              <div class="r-info">
                <div class="msgBox">
                  <div class="name">网络考试</div>
                  <div class="VideoLearn">
                    <ul>
                      <li>
                        <ul>
                          <li>考试时间</li>
                          <li>2020年3月15日-2020年4月18日</li>
                        </ul>
                      </li>
                      <li class="wlbtnbox">
                        <span class="wlbtn info">尚未开始</span>
                        <a href="" class="wlbtn primary">已开始</a>
                        <span class="wlbtn warning">等待批改</span>
                        <span class="wlbtn success">合格（65分）</span>
                        <span class="wlbtn danger">不合格（45分），可补考</span>
                        <span class="wlbtn danger">不合格（45分）</span>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
            <div class="timeline-block">
              <div class="ctimeline-img cd-picture"></div>
              <span class="item dot-top"></span>
              <div class="r-info">
                <div>
                  <text class="Headlines">结业</text>
                </div>
                <div class="msgBox">
                  <div class="name">结业准备</div>
                  <div class="up">
                    <input
                      onclick="javascript:$('.uptoimg').click();"
                      type="button"
                      class="upbtn"
                      value="上传图片"
                    />
                    <input type="file" class="uptoimg none" />
                  </div>
                </div>
              </div>
            </div>
            <div class="timeline-block">
              <div class="ctimeline-img cd-picture"></div>
              <div class="r-info">
                <div class="msgBox">
                  <div class="name">查看证书</div>
                  <div class="VideoLearn">
                    <ul>
                      <li class="wlbtnbox">
                        <a href="" class="wlbtn look">查看证书</a>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
            <div class="timeline-block">
              <div class="ctimeline-img cd-picture"></div>
              <div class="r-info">
                <div class="msgBox">
                  <div class="name">学习完成</div>
                  <div class="VideoLearn">
                    <ul>
                      <li class="wlbtnbox">
                        <a href="" class="wlbtn success">毕业</a>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
          </section>
        </div>
      </div>
    </div>
    <div class="foot">
      <a class="sy checked"><span></span><i>首页</i></a>
      <a class="kc"><span></span><i>我的课程</i></a>
      <a class="grzx"><span></span><i>个人中心</i></a>
    </div>
  </body>
  <script src="js/jquery-1.12.0.min.js"></script>
  <script src="js/public.js"></script>
  <script></script>
</html>
